<template>
<div class="title-bar" :style="border?'border-bottom:1px solid #ebeef5':''">
    <span class="t-b-name">{{title}}</span>
    <el-divider v-if="!border && ['/expEdit', '/modelList'].includes($route.path)"></el-divider>
    <slot name="item"></slot>
</div>
</template>

<script>
export default {
    name: 'TitleBar',
    props: {
        title: {
            type: String,
            required: true
        },
        border: {
            type: Boolean,
            default: false
        }
    }
}
</script>

<style lang="less" scoped>
.title-bar {
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    .el-divider {
        margin-left: 10px;
    }

    .t-b-name {
        display: inline-block;
        height: 14px;
        line-height: 14px;
        font-size: 14px;
        border-left: 5px solid #2680eb;
        padding-left: 8px;
        font-weight: 600;
    }

}
</style>
